﻿@{
    <script src="~/js/jquery-1.11.1.js"></script>
    <link href="~/css/table.css" rel="stylesheet" />
    <script src="~/js/vue.js"></script>
}
<body>
    <div id="app">
        <table width="100%">
            <tr>
                <td>
                    <font color="black">您正在做的业务是:人力资源管理--薪酬标准管理--薪酬标准登记复核</font>
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td>
                    当前等待复核的薪酬标准总数:
                    {{rows}}
                    例
                </td>
            </tr>
        </table>
        <table width="100%" border="1" cellpadding=0 cellspacing=1
               bordercolorlight=#848284 bordercolordark=#eeeeee
               class="TABLE_STYLE1">
            <tr>
                <td width="18%" class="TD_STYLE1">
                    <span>薪酬标准编号</span>
                </td>
                <td width="19%" class="TD_STYLE1">
                    <span>薪酬标准名称</span>
                </td>
                <td width="16%" class="TD_STYLE1">
                    <span>制定人</span>
                </td>
                <td width="30%" class="TD_STYLE1">
                    <span>登记时间</span>
                </td>
                <td width="13%" class="TD_STYLE1">
                    薪酬总额
                </td>
                <td width="4%" class="TD_STYLE1">
                    复核
                </td>
            </tr>


            <tr class="TD_STYLE2" v-for="(item,index) in dt">
                <td>
                    {{item.standard_id}}
                </td>
                <td>
                    {{item.standard_name}}
                </td>
                <td>
                    {{item.designer}}
                </td>
                <td>
                    {{item.regist_time|odate}}
                </td>
                <td>
                    &nbsp;
                    {{item.salary_sum}}
                </td>
                <td>
                    <a :href="'/xinchoubiaozhun/salarystandard_check/'+item.standard_id">复 核</a>
                </td>
            </tr>
        </table>


        <p>
            <div align="center" style="font-size: 18px;color: gray">
                &nbsp;&nbsp;总数：
                <font style="color: maroon;font-weight: bold;">{{rows}}</font>
                例
                &nbsp;&nbsp;&nbsp;
                每页显示 <font style="color: maroon;font-weight: bold;">{{pageSize}}</font>
                条
                &nbsp;&nbsp;&nbsp;
                当前第 <font style="color: maroon;font-weight: bold;">{{currentpage}}</font>
                页
                &nbsp;&nbsp;&nbsp;共
                <font style="color: maroon;font-weight: bold;">{{pages}}</font>
                页
                <a style="color: navy;font-weight: bold" v-on:click="first()">首页</a>

                <a style="color: navy;font-weight: bold"
                   v-on:click="prex()">上一页</a>

                <a style="color: navy;font-weight: bold"
                   v-on:click="next()">下一页</a>

                <a style="color: navy;font-weight: bold"
                   v-on:click="last()">末页</a>
                &nbsp;&nbsp;&nbsp;跳到第
                <input id="page" type="text" value="1" class=input1 size=1>
                页&nbsp;&nbsp;
                <input type="image" src="~/images/go.bmp" v-on:click="tiao()" width=18 height=18 border=0>
                <input type="hidden" name="page.startPage" id="startpage" value="1">
            </div>
    </div>
    <script type="text/javascript">
        var vm = new Vue({
            el: "#app",
            data: {
                dt: [],
                rows: 0,
                pages: 0,
                pageSize: 3,
                currentpage: 1,
            },
            methods: {
                load: function () {
                    var t = this;
                    $.ajax({
                        url: "/xinchoubiaozhun/salarystandard_check_list?currentpage=" + t.currentpage,
                        type: "post",
                        success: function (msg) {
                            var dr = eval(msg);
                            t.dt = dr["dt"];
                            t.rows = dr["rows"];
                            t.pages = dr["pages"];
                        }
                    })
                },
                first: function () {
                    var t = this;
                    t.currentpage = 1;
                    t.load();
                },
                last: function () {
                    var t = this;
                    t.currentpage = t.pages;
                    t.load();
                },
                prex: function () {
                    var t = this;
                    if (t.currentpage > 1) {
                        t.currentpage--;
                    } else {
                        t.currentpage = 1;
                    }
                    t.load();
                },
                next: function () {
                    var t = this;
                    if (t.currentpage < t.pages) {
                        t.currentpage++;
                    } else {
                        t.currentpage = t.pages;
                    }
                    t.load();
                },
                tiao: function () {
                    var t = this;
                    var page = $("#page").val();
                    var zw = /^[0-9]*$/;
                    if (!zw.test(page)) {
                        t.currentpage = 1;
                    } else if (page > t.pages) {
                        t.currentpage = 1;
                        $("#page").val('1');
                    } else if (page < t.currentpage) {
                        t.currentpage = 1;
                        $("#page").val('1');
                    } else {
                        t.currentpage = page;
                        $("#page").val('1');
                    }
                    t.load();
                }
            },
            mounted: function () {
                this.load();
            },
            filters: {
                odate: function (d) {
                    var time = new Date(d);
                    var y = time.getFullYear();
                    var m = time.getMonth();
                    var d = time.getDate();
                    return y + "年" + m + "月" + d + "日";
                }
            }
        })
    </script>
</body>



